<!--
 * @Author: 四川华西绿舍建材有限公司
 * @Date: 2024-04-19 20:43:32
 * @LastEditors: 陈波
 * @LastEditTime: 2024-04-19 22:19:47
 * @Description: 
 * @FilePath: \graDesign\src\views\DataBigScreen\SAC\components\3D\index3D.vue
-->
<template>
  <div class="three3D-section">
    <div class="top_left">
      <AccuracySAC />
    </div>
    <div class="top_right">
      <AccuracyTD3Lstm />
    </div>
    <div class="bottom_left">
      <EnergySAC />
    </div>
    <div class="bottom_right">
      <EnergyTD3Lstm />
    </div>
  </div>
</template>

<script setup lang="ts">
import AccuracySAC from './AccuracySAC.vue'
import EnergySAC from './EnergySAC.vue'
import AccuracyTD3Lstm from './AccuracyTD3Lstm.vue'
import EnergyTD3Lstm from './EnergyTD3Lstm.vue'

</script>

<style scoped lang="scss">
.three3D-section {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    .top_left,
    .top_right,
    .bottom_left,
    .bottom_right{
        width: 47%;
        height: 43vh;
        margin-top: 0.5rem;
    }
}
</style>
